

<ul class="breadcrumb">
  <li><a href="{:U(GROUP_NAME . '/Index/index')}">首页</a> <span class="divider">/</span></li>
  <li class="active">消息列表</li>
</ul>
<h2 class="text-center">个人消息</h2>
<ul class="nav nav-tabs" id="myTab">
  <li class="active"><a href="#new">最新消息</a></li>
  <li><a href="#history">历史消息</a></li>
</ul>
 
<div class="tab-content">
  <div class="tab-pane active" id="new">
    <ul class="myul">
      <volist name="read" id="u">
        <li><a href="{:U(GROUP_NAME . '/Person/messageHandle', array('m_id' => $u['m_id']))}">{$u.content}</a></li>
      </volist>
    </ul>
  </div>
  <div class="tab-pane" id="history">
    <ul class="myul">
      <volist name="unread" id="u">
        <li><a href="{:U(GROUP_NAME . '/Person/messageHandle', array('m_id' => $u['m_id']))}">{$u.content}</a></li>
      </volist>
    </ul>
  </div>
</div>
 
<script>
  $(function () {
    $('#myTab a').each(function(){
      $(this).click(function(){        
       $(this).tab('show');
      })
    });
  })
</script>

<style>
  .myul li{
    display: block;
    width: 95%;
    border-radius: 3px;
    border: 1px dashed #ccc;
    height: 40px;
    line-height: 40px;
    margin-top: 8px;
    padding-left: 8px;
    color: gray;
    font-size: 18px;
  }
</style>